<template>
	<div class="containers">
		<top_bg>
			<template v-slot:title>
				<p>{{title}}</p>
			</template>
		</top_bg>
		<div class="bg">
			<!-- <van-pull-refresh style="min-height: 100vh;" v-model="refreshing" @refresh="onRefresh"> -->
			<van-list class="mylist" v-model:loading="loading" :finished="finished" finished-text="没有更多了"
				@load="onLoad">
				<div v-for="(one_item,index) in items" :key="one_item.id" :class="Number(Math.max(...Object.keys(items))) !=  Number(index) ? 'cart_item' : 'cart_item1'">
					<img width="140" :src=picArray[index] />
					<div class="right">
						<div class="p1 flex" style="margin-right: 80px;">
							<div>
								<p class="p1" style="margin-bottom: 10px; width:150" v-if="one_item.title != undefined">
									{{one_item.title.length > 15 ? one_item.title.substr(0,15)+'...':one_item.title}}
								</p>
								<p class="description p1" style="margin:0; padding:0"
									v-if="one_item.description != undefined">
									{{one_item.description.length > 60 ? one_item.description.substr(0,60)+'...':one_item.description}}
								</p>
							</div>
							<!--          <img style="height: 1.5rem;" :src="require('../assets/delete.png')"
												@click="delItem(index)" /> -->
						</div>
						<div class="p1 moneyNumber">
							<span class="money" style="color:#EC4228">AED:{{parseInt(newMoney[index]).toFixed(2)}}</span>
							<!-- <van-field name="stepper">
								<template #input>
									<van-stepper v-model="value" @change="change" />
								</template>
							</van-field> -->
							<div class="order_cart_item_right">
								<img class="del_btn" width="25" :src="require('../../assets/delete.png')"
									@click="delItem(index)" />
								<p class="reduce" @click="reduce(index)">-</p>
								<input class="input_text" v-model="realValue[index]" @click="myOldData(index)"
									@change="myNewData(index)" />
								<p class="plus" @click="plus(index)">+</p>
							</div>
						</div>
					</div>
				</div>

				<!-- <div class="van-clearfix"> -->


				<order_form v-if="false" class="order_form" v-for="(one_item,index) in items" :key="one_item.id">
					<template v-slot:order_one_cart_item_img>
						<img :src=uploads_url+one_item.thumb class="draws_one_cart_item_img" />
					</template>

					<template v-slot:order_one_cart_item_desc>
						<div class="draws_one_cart_item_desc">
							<p>{{one_item.title.length > 20? one_item.title.substr(0,20)+"...":one_item.title}} </p>
						</div>
					</template>
					<template v-slot:order_one_cart_item_price>
						<div class="draws_one_cart_item_price">
							<p>AED:{{newMoney[index]}}</p>
						</div>
					</template>

					<template v-slot:order_one_cart_item_right>
						<div class="order_cart_item_right">
							<p class="reduce" @click="reduce(index)">-</p>
							<input class="input_text" v-model="realValue[index]" @click="myOldData(index)"
								@change="myNewData(index)" />
							<p class="plus" @click="plus(index)">+</p>
						</div>
					</template>
					<template v-slot:order_one_cart_item_right_del>
						<div class="order_cart_item_right_del">
							<img style="height: 1.5rem;" :src="require('../../assets/delete.png')"
								@click="delItem(index)" />
						</div>
					</template>

				</order_form>
				<!-- </div> -->

			</van-list>
			<!-- </van-pull-refresh> -->
			<div class="bottom" v-if="show">
				<p class="bottom_txt1">Total Amount</p>
				<p class="bottom_txt2">AED:{{parseFloat(allMoney).toFixed(2)}}</p>
				<van-button class="bottom_btn" @click="pay">
					<p class="bottom_txt3">Pay</p>
				</van-button>
			</div>
			<!-- 底部导航 -->
			<footer_nav />
		</div>
	</div>
</template>


<script>
	import order_form from '@/components/order_form'
	import bottom_info from '@/components/bottom_info'
	import globalData from '@/main.js'
	import {
		ref
	} from 'vue'

	import {
		floatingBubbleProps,
		showToast
	} from 'vant'

	import {
		botimPay
	} from '../../util.js'


	export default {
		setup() {
			const finished = ref(false);
			const list = ref([]);
			const onLoad = () => {
				// 异步更新数据
				// setTimeout 仅做示例，真实场景中一般为 ajax 请求
				console.log("===onLoad===")
				setTimeout(() => {
						for (let i = 0; i < 3; i++) {
							list.value.push(list.value.length + 1);
						}

						// 加载状态结束
						loading.value = false;

						// 数据全部加载完成
						if (list.value.length >= 5) {
							finished.value = true;
						}
					},
					1000);
			};
		},
		data() {
			return {
				title: "Cart",
				items: {},
				uploads_url: '',
				realValue: {},
				newMoney: {},
				perPrice: {},
				show: false,
				allMoney: 0,
				offset: 10,
				timerId: 0,
				oldRealValue: {},
				timerCount: 0,
				picArray: {},
			}
		},
		created() {
			//console.log("---created---")
			this.getAllDraws();
			window.scroll(0, 0);
		},
		mounted() {
			this.uploads_url = globalData['uploads_url']
			if(parseInt(this.allMoney) < 0) {
				this.allMoney = 0;
			}
		},
		methods: {
			myOldData: function(index) {
				//console.log(' realValue ', this.realValue[index]);
				if(this.realValue[index] < 0) {
					this.realValue[index] = 0;
				}
				this.oldRealValue[index] = this.realValue[index];
				//console.log(' old value ', this.oldRealValue[index]);
			},
			myNewData: function(index) {
				var that = this
				
				//console.log('input New value:', that.realValue[index]);
				//console.log('that.oldRealValue[index]:', that.oldRealValue[index]);
				if(parseInt(that.realValue[index]) < 0) {
					that.realValue[index] = 0;
				}
				if(parseInt(that.realValue[index]) > parseInt(that.items[index]['shenyurenshu'])) {
					that.realValue[index] = parseInt(that.items[index]['shenyurenshu'])
				}
				
				//console.log("that.realValue[index]:", that.realValue[index])
				//console.log("that.oldRealValue[index]:", that.oldRealValue[index])
				var diffRealValue = parseInt(that.realValue[index]) - parseInt(that.oldRealValue[index])
				
				//console.log("diffRealValue:", diffRealValue)
				//console.log("that.realValue[index]:", that.realValue[index])
				//console.log("that.perPrice[index]:", that.perPrice[index])

				var uid = that.$cookies.get('uid')
				//console.log('===myNewData uid===', uid)
				//showToast('===myNewData uid===', uid);
				if(uid == undefined || String(uid) == "" || String(uid).length == 0)
				{
					uid = String(window.Bridge.getStorageSync('uid'))
				}
				if(uid == undefined || String(uid) == "" || String(uid).length == 0)
				{
					return;
				}
				if (parseInt(diffRealValue) < 0) {
					that.newMoney[index] = parseInt(that.realValue[index]) * parseInt(that.perPrice[index]).toFixed(2); //+ ".00";
					//console.log('===that.newMoney[index] value:', that.newMoney[index]);
					
					that.allMoney -= (parseInt(diffRealValue) * (-1)) * that.perPrice[index];
					if(that.allMoney < 0){
						that.allMoney = 0;
					}
					var item = that.items[index];
					that.postTo(item, parseInt(diffRealValue) * (-1), uid);
					if (Object.keys(that.items).length > 0) {
						that.show = true
					} else {
						that.show = false
					}
				} else {
					//console.log("===shenyurenshu:", that.items[index]['shenyurenshu'])
					//console.log("that.realValue[index]:", that.realValue[index])
					//showToast('===shenyurenshu===', that.items[index]['shenyurenshu']);
					if (parseInt(that.items[index]['shenyurenshu']) < parseInt(that.realValue[index])) {
						//showToast("has not enough shenyurenshu!" + "only has:" + that.items['shenyurenshu'])
						that.realValue[index] = that.items[index]['shenyurenshu']
						that.newMoney[index] = parseInt(that.realValue[index]) * parseInt(that.perPrice[index]); // + ".00";
						//console.log('===2222that.newMoney[index] value:', that.newMoney[index]);
						
						that.allMoney = parseInt(that.newMoney[index]);
						// return;
					}
					else
					{
						//that.realValue[index] = that.items[index]['shenyurenshu']
					}

					that.newMoney[index] = (that.realValue[index] * that.perPrice[index]).toFixed(2); // + ".00";
					//console.log('===333that.newMoney[index] value:', that.newMoney[index]);
					
					that.allMoney = that.newMoney[index];

					var item = that.items[index];

					that.axios({
						method: "GET",
						url: globalData['add_cart_url'] + item.id + "/" + parseInt(diffRealValue) + "/0/" + uid
					}).then(function(response) {
						//console.log("addCart response:", response)
						//console.log("addCart response data:", response.data) //JSON.stringify(data)
						// for (var i = 0; i < response.data.length; i++) {
						// 	console.log("addCart one item data:", response.data[i])
						// }
					}).catch(function(error) { // 请求失败处理
						console.log(error);
					});
				}
			},
			goPrePage() {
				this.$router.back()
			},
			getAllDraws: function() {
				var that = this
				//console.log("---getAllDraws start request:" + globalData['mobile_url'] + "cart/cartlist")
				var userId = this.$cookies.get('uid')
				if(userId == undefined || String(userId) == "" || String(userId).length == 0)
				{
					userId = String(window.Bridge.getStorageSync('uid'))
				}
				//console.log("===getAllDraws userId===", userId)
				//showToast("userId:"+userId)
				const formData = new FormData()
				if (userId != null) {
					formData.append("uid", userId)
				}
				
				
				var user = this.$cookies.get('user')
				if(user == undefined || String(user) == "" || String(user).length == 0)
				{
					user = String(window.Bridge.getStorageSync('user'))
				}
				
				formData.append("ucenterid", user.ucenterid)
				formData.append("uuid", user.uid)
				this.axios({
					method: "POST", // method:"post" data:{"firstName":"Tom","lastName":"Sun"} //get params:{id:123}
					url: globalData['mobile_url'] + "cart/cartlist/",
					data: formData,
				}).then(function(response) {
					//console.log("cartlist response:", response)
					//console.log("response data:", response.data) //JSON.stringify(data)
					if (Object.keys(response.data[0]).length > 0) {
						that.show = true
					}
					that.realValue.length = 0
					that.items = response.data[0]
					for (let k in that.items) {
						var images = that.items[k].picarr;
						that.parsePicArr(k, images);
					}
					// for (let key in response.data[0]) {
					// 	console.log("one item data key:", key)
					// 	console.log("one item data:", response.data[0][key])
					// 	console.log("one item data moneyxx:", parseFloat(response.data[0][key].money))
					// }

					for (let key in response.data[2]) {
						var curNum = response.data[2][key].num
						if(curNum < 0) {
							curNum = 0;
						}
						that.realValue[key] = curNum;
						if (response.data[2][key].money == null) {
							delete that.items[key];
							continue
						}
						//console.log("one item data money type:", typeof response.data[2][key].money)

						var money = response.data[2][key].money.toFixed(2);
						if(money < 0) {
							money = 0;
						}

						that.newMoney[key] = money;
						if (curNum != 0) {
							that.perPrice[key] = Number(money / curNum);
						} else {
							that.perPrice[key] = Number(that.items[key]['yunjiage']);
						}
						
						if(response.data[2][key].money > 0 ) {
							that.allMoney += response.data[2][key].money
						}
						
						//console.log("===one item data money111===:", that.allMoney)
					}
					// for (let i = 0; i < that.realValue.length; i++) {
					// 	console.log(that.realValue[i]);
					// }
				}).catch(function(error) { // 请求失败处理
					console.log("---error start---");
					console.log(error);
					console.log("---error end---");
				});
			},

			plus(index) {
				var that = this;
				//console.log("---plus---this.realValue[index]:", that.realValue[index])
				if (that.items[index]['canyurenshu'] >= that.items[index]['zongrenshu']) {
					//console.log("has not enough item!!!")
					showToast("has not enough item!!!")
					return;
				}

				if (parseInt(that.realValue[index]) >= parseInt(that.items[index]['shenyurenshu'])) {
					//console.log("has not enough item!!!")
					showToast("has not enough item!")
					that.realValue[index] = that.items[index]['shenyurenshu']
					return;
				}

				var userId = that.$cookies.get('uid')
				//console.log('===plus xx userId===', userId)
				if(userId == undefined || String(userId) == "" || String(userId).length == 0)
				{
					userId = String(window.Bridge.getStorageSync('uid'))
				}
				if(userId == undefined || String(userId) == "" || String(userId).length == 0 )
				{
					return;
				}

				var curNumber = parseInt(that.realValue[index]);
				that.realValue[index] = curNumber + 1;
				that.newMoney[index] = parseInt(that.realValue[index]) * parseInt(that.perPrice[index]).toFixed(2); // + ".00";
				//console.log("===that.perPrice[index]===",that.perPrice[index])
				//console.log("===allMoney===",that.allMoney)
				that.allMoney = parseInt(that.allMoney) + parseInt(that.perPrice[index]);
				//console.log("===allMoney===",that.allMoney)

				var item = that.items[index];

				that.axios({
					method: "GET",
					url: globalData['add_cart_url'] + item.id + "/" + "1/0/" + userId
				}).then(function(response) {
					//console.log("plus addCart response:", response)
					//console.log("addCart response data:", response.data) //JSON.stringify(data)
					// for (var i = 0; i < response.data.length; i++) {
					// 	console.log("addCart one item data:", response.data[i])
					// }
				}).catch(function(error) { // 请求失败处理
					console.log(error);
				});
			},
			reduce(index) {
				//console.log("---reduce---index:", index)
				var that = this;

				var curNumber = Number(that.realValue[index]);
				//console.log("---reduce---curNumber:", curNumber)

				if (curNumber <= 0) {
					return;
				}

				var userId = that.$cookies.get('uid')
				//console.log('===reduce xx userId===', userId)
				if(userId == undefined || String(userId) == "" || String(userId).length == 0)
				{
					userId = String(window.Bridge.getStorageSync('uid'))
				}

				that.realValue[index] = curNumber - 1;
				that.newMoney[index] = (that.realValue[index] * that.perPrice[index]).toFixed(2); //+ ".00";
				that.allMoney -= that.perPrice[index];

				var item = that.items[index];
				that.postTo(item, 1, userId);
				if (Object.keys(that.items).length > 0) {
					that.show = true
				} else {
					that.show = false
				}
			},
			delItem: function(index) {
				var that = this
				//that.items.splice(index,1);

				that.newMoney[index] = (that.realValue[index] * that.perPrice[index]).toFixed(2); // + ".00";

				that.allMoney -= that.newMoney[index];

				var item = that.items[index];
				//console.log("---delCart ---item:", item)

				//console.log("---delCart url ---", globalData['goods_url'] + item.id)
				var shopInfo = {
					'shopid': item.id,
					'money': item.money,
					'shenyu': item.shenyurenshu,
				};
				var userId = that.$cookies.get('uid')
				//console.log("===delItem userId===", userId)
				if(userId == undefined || String(userId) == "" || String(userId).length == 0)
				{
					userId = String(window.Bridge.getStorageSync('uid'))
				}
				if(userId == undefined || String(userId) == "" || String(userId).length == 0)
				{
					return;
				}
				//console.log("---delCart ---shopInfo:", shopInfo)


				that.postTo(item, 0, userId);

				delete that.items[index]
				if (Object.keys(that.items).length > 0) {
					that.show = true
				} else {
					that.show = false
				}
			},
			postTo: function(item, itemCount, userId) {
				//console.log("===postTo item.id===", item.id)
				//console.log("===postTo itemCount===", itemCount)
				//console.log("===postTo userId===", userId)
				this.axios({
					method: "GET",
					url: globalData['del_cart_url'] + item.id + "/" + itemCount + "/" + userId
				}).then(function(response) {
					//console.log("delCart response:", response)
					//console.log("delCart response data:", response.data) //JSON.stringify(data)
					// for (var i = 0; i < response.data.length; i++) {
					// 	console.log("delCart one item data:", response.data[i])
					// }
				}).catch(function(error) { // 请求失败处理
					console.log(error);
				});
			},
			pay() {
				//console.log("===Pay===")
				var that = this
				//console.log(that.items);
				var userId = this.$cookies.get('uid')
				if(userId == undefined || String(userId) == "" || String(userId).length == 0)
				{
					userId = String(window.Bridge.getStorageSync('uid'))
				}
				var user = $cookies.get('user')
				//console.log("===userId===", userId)
				//console.log("===user===", user)
				var payData = new FormData();
				var goodsName = [];
				var goodsId = [];
				var goodsNum = 0;
				var goodsInfo = '';
				var realMoney = 0;
				for (var _item in that.items) {
					//console.log("xxxxxxxxx",that.items[_item].shenyurenshu)
					if (Number(that.realValue[_item]) >= Number(that.items[_item].shenyurenshu)) {
						that.realValue[_item] = Number(that.items[_item].shenyurenshu)
					}
					else {
						continue;
					}
					goodsNum += Number(that.realValue[_item])
					goodsId.push(_item)
					goodsName.push(that.items[_item].title)
					goodsInfo += _item
					goodsInfo += ','
					goodsInfo += Number(that.realValue[_item])
					goodsInfo += '|'
					realMoney += (Number(that.realValue[_item]) * Number(that.items[_item].yunjiage)).toFixed(2);
					that.allMoney = realMoney;
				}
				//showToast("real allMoney:"+that.allMoney+"count:"+parseInt(that.realValue[_item]));
				
				goodsInfo = goodsInfo.slice(0, goodsInfo.length - 1)
				//console.log("--------------------------")
				//console.log(goodsInfo);
				//console.log("--------------------------")
				payData.append("goodsName", goodsName)
				payData.append("goodsId", goodsId)
				payData.append("goodsNum", goodsNum)
				payData.append("allMoney", that.allMoney)
				payData.append("userId", userId)
				payData.append("goodsInfo", goodsInfo)
				if (user != null) {
					if (user.ucenterid != null) {
						payData.append("ucenterid", user.ucenterid)
					} else {
						payData.append("ucenterid", user.lastName)
					}
				}

				var walletEnabled = 5
				if (window.BOT.checkAPILevel(27)) { //能够检测的情况

					window.BOT.nativeCall({
						method: 'App.walletEnabled',
						callback: {
							success: (res) => {
								//console.log(res,1111)
								// 异步操作成功，读取返回值
								// showToast(JSON.stringify(res))
								walletEnabled = Number(res.data.enable)
								if (1 == walletEnabled) {
									this.processWallet(payData);
								} else {
									this.processPayPage(payData);
								}
							},
							fail: (err) => {
								showToast("fail")
								console.log(err)
							},
						}
					})

				} else { // 不支持检测的情况
					walletEnabled = user?.phone?.countryCode === '971' ? 1 : 0
					//console.log("===payDataxx===", payData)
					this.processPayPage(payData);
				}
			},
			processWallet(payData) {
				this.axios({
					method: "POST",
					url: globalData['mobile_url'] + "cart/getWallet/",
					data: payData,
				}, {
					headers: {
						'Access-Control-Allow-Origin': '*'
					}
				}).then(function(response) {
					var that = this
					//console.log("response:", response)
					//console.log("response data:", response.data)

					if (response.data == null) {
						return;
					}

					window.BOT.requestPayment({
						tradeId: response.data['transactionId'],
						loading: '0'
					}, {
						success: (res) => {
							//showToast("xxxxx");
							resolve({
								payResult: 'S',
								data: res
							})
						},
						fail: (err) => {
							//console.log(err)
							reject(err)
						}
					})

					//this.getPayState(response.data['order_no'])
					that.MyPoll(response.data['order_no'])
				}).catch(function(error) { // 请求失败处理
					console.log(error);
				});

				//console.log("=========================================");
				// 	for (let [key, value] of payData.entries()) {
				// 		console.log(key + ": " + value);
				// 	}
				// 	console.log("=========================================");
			},
			processPayPage(payData) {
				// showToast("processPayPage")
				var orderNo = "";
				var that = this
				this.axios({
					method: "POST",
					url: globalData['mobile_url'] + "cart/getPayPage/",
					data: payData,
				}, {
					headers: {
						'Access-Control-Allow-Origin': '*'
					}
				}).then(function(response) {
					//showToast("draws processPayPage xxxxxx", response)
					//console.log("response:", response)
					/*
					https://checkout.payby.com/pay-page/main?BIZ_TYPE=202&ft=6e34e7b0bc054c88a23e314def81246b&t=1709188975207
					https://botim.me/mp/b/?app=me.botim.pay.paybycheckout%2Fpay-page%2Fmain%3FBIZ_TYPE%3D202%26ft%3Dca32870a28ed4ab6bd97f87123ecce39%26t%3D1706255408905
					*/
					//showToast("realUrl:" + realUrl)
					// console.log("realUrl:" + realUrl)
					if (response.data == null) {
						return;
					}
					if (response.data['payPageUrl'] != null) {
						const mypayForPayPage = (url) => {
							const payInfo = url?.match(/\.com(.*)/)[1]
							const payPageUrl = `https://botim.me/mp/b/?app=me.botim.pay.paybycheckout${encodeURIComponent(
							    `${payInfo}`
							  )}`
							return payPageUrl
						}

						var newPayPageUrl = mypayForPayPage(response.data['payPageUrl'])
						// showToast("newPayPageUrl:"+newPayPageUrl)
						// console.log("newPayPageUrl:", newPayPageUrl)
						//
						//var payUrl = "https://botim.me/mp/b/?app=me.botim.pay.paybycheckout%2Fpay-page%2Fmain%3BIZ_TYPE%3D202%26ft%3D17aaef60b08b4e2fa121484d1c07eaf5%26t%3D17092152224022"
						window.BOT.navigateTo(newPayPageUrl)
					}
					orderNo = response.data['order_no']
					//this.getPayState(response.data['order_no'])
					//console.log("xxxxxxxx")
					that.MyPoll(orderNo)
					//console.log("yyyyyyyyy")
				}).catch(function(error) { // 请求失败处理
					console.log(error);
				});

				// 	console.log("=========================================");
				// 	for (let [key, value] of payData.entries()) {
				// 		console.log(key + ": " + value);
				// 	}
				// 	console.log("=========================================");
			},
			MyPoll(orderNo) {
				//showToast("...Poll..."+ orderNo)
				var that = this
				//console.log("xxMyPollxxxx")
				that.getPayState(orderNo);
				that.timerId = setTimeout(() => {
						if (that.timerCount == 3) {
							clearTimeout(that.timerId);
						} else {
							that.MyPoll(orderNo)
							that.timerCount++
						}
					},
					5000)
			},
			getPayState: function(orderNo) {
				//showToast("xxxxxxyyyyyyzzzz");
				if (orderNo == undefined) {
					console.log("orderNo is undefined");
					return;
				}
				var userId = this.$cookies.get('uid')
				if(userId == undefined || String(userId) == "" || String(userId).length == 0)
				{
					userId = String(window.Bridge.getStorageSync('uid'))
				}
				//console.log("===pay state===orderNo:", orderNo)
				//console.log("===pay state===userId:", userId)
				this.axios({
					method: "GET",
					url: globalData['mobile_url'] + "cart/getPayState/" + orderNo + "/" + userId,
				}, {
					headers: {
						'Access-Control-Allow-Origin': '*'
					}
				}).then(function(response) {
					//console.log("===getPayState===response:", response)
					var that2 = this
					if (response.data == "已付款,已发货,未完成") {
						//showToast("pay ok!!!")
						clearTimeout(that2.timerId);
						that2.show = false
						for (var key in that2.items) {
							if (that2.items.hasOwnProperty(key)) { // 确保属性是对象自身的而不是从原型链继承的
								delete that2.items[key]; // 删除属性
							}
						}
						window.location.reload();
					}
				}).catch(function(error) { // 请求失败处理
					console.log(error);
				});

			},
			parsePicArr: function(index, picArr) {
				//console.log("===index===",picArr)
				//console.log("===picArr===",picArr)
				var infos = picArr.split(":");
				//console.log("===infos===",infos)
				for (var _info in infos) {
					//console.log("===_info===",infos[_info])
					//console.log("===_info===",typeof infos[_info])
					if (!infos[_info].includes("shopimg")) {
						continue
					}
					var newInfos = infos[_info].split(";");
					//console.log("===newInfos===",newInfos)
					for (var _info1 in newInfos) {
						//console.log("===newInfos[_info1]===",newInfos[_info1])
						if (!newInfos[_info1].includes("shopimg")) {
							continue
						}

						var imagestr = newInfos[_info1].split(";");
						//console.log("===images===",imagestr)
						var tmpIndex = 0;
						for (var _image in imagestr) {
							//console.log("imagestr[_image]",imagestr[_image])

							if (tmpIndex++ != imagestr.length - 1) {
								continue;
							}
							//console.log("imagestr[_image]22",imagestr[_image])
							var reg1 = new RegExp('"', "g")
							//console.log("imagestr[_image]",imagestr[_image].replace(reg1," "))
							if (imagestr[_image].includes("shopimg")) {
								//this.imageArray.push("require(\""+this.uploads_url+imagestr[_image].replace(reg1,"")+"\")")
								this.picArray[index] = this.uploads_url + imagestr[_image].replace(reg1, "")
							}
							//console.log("===this.picArray===:",this.picArray)
						}
					}
				}
				//console.log("===this.imageArray===",this.imageArray)
			},
		}
	}
</script>

<style scoped lang="less">
	.containers {
		/* 设置 flex 容器为多行包裹，使 div 换行 */
		/* justify-content: space-around; */
		/* 在主轴上居中对齐 */
		display: flex;
		flex-direction: column;
		flex-wrap: wrap;
		/* 允许flex容器换行 */
		justify-content: space-between;
		// height: 150vh; 
	}

	.bg {
		height: calc(100vh - 6.5rem);
		/* overflow-y: auto; */
		background-color: #f8f8f8;
	}

	.mylist {
		// width: 100%;
		// height: 130vh;
		// overflow-y: auto;
		// height: 200vh;
	}

	.cart_item {
		width: 100vw;
		height: 330px;
		// border:solid 1px red;
		display: flex;
		//justify-content: space-between;
		align-items: center;
		padding: 20px;
		box-sizing: border-box;
		background-color: white;
		// margin-bottom: 2rem;
		margin-bottom: 20px;
		z-index: 10;
		// style="margin-bottom: 10px; background-color: #08080808; border-radius: 10px;"
	}

	.cart_item1 {
		width: 100vw;
		height: 330px;
		// border:solid 1px red;
		display: flex;
		//justify-content: space-between;
		align-items: center;
		padding: 20px;
		box-sizing: border-box;
		background-color: white;
		// margin-bottom: 2rem;
		margin-bottom: 10.5rem;
		z-index: 10;
		// style="margin-bottom: 10px; background-color: #08080808; border-radius: 10px;"
	}

	.right {
		height: 100%;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		// padding-left: 10px;
		font-family: 'PingFang SC';
		font-size: 0.9rem;
		// padding:10px;
		box-sizing: border-box;

		position: relative;
		/* 添加相对定位 */
		left: 15px;

		/* 使用负边距将其向左移动 */
	}

	.p1 {
		margin: 0;
		padding: 0;
	}



	.money {
		font-size: 1.1rem;
		font-family: 'PingFang SC';
		color: #EC4228;
	}

	.moneyNumber {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.description {
		padding-top: 40px;
		font-size: 0.7rem;
		// width: 100px;
		width: 250px;
		// border: solid 1px red;
	}

	:deep(.van-field__control--custom) {
		display: flex;
		justify-content: flex-end;
		zoom: 1.5;
	}

	:deep(.van-stepper__input) {
		width: 30px;
	}

	:deep(.van-cell) {
		background-color: transparent;
	}

	.flex {
		display: flex;
	}

	.order_form {
		position: relative;
	}

	.order_form .draws_one_cart_item_img {}

	.order_cart_item_right_del {
		/* position: relative; */
		/* 设置按钮的定位 */
		/* margin-left: 20rem;
		top: -13rem;
		width: 2rem;
		 
		z-index: 5;
		color: #EC42ff; */
		position: absolute;
		/* 设置按钮的绝对定位 */
		top: 0;
		/* 按钮距离父元素顶部的距离 */
		right: 0;
		/* 按钮距离父元素右侧的距离 */
		transform: translate(50%, -50%);
		/* 将按钮向右上方偏移，使其位于右上角 */
		// z-index: -2;
		/* 设置 z-index 以保证按钮位于顶层 */
		color: #EC42ff;
		/* 设置按钮文字颜色 */
		top: 1rem;
		/* 按钮距离父元素顶部的距离增加 1rem */
		right: 3rem;
		/* 按钮距离父元素右侧的距离增加 1rem */
		transform: translate(30%, 30%);
		/* 微调按钮位置，使其稍微往左下移动 */
	}

	.draws_one_cart_item_img {
		margin-top: 2.5rem;
		margin-left: 0.5rem;
		border: 0.1;
		border-radius: 20px;
		max-width: 35%;
		max-height: 35%;
		/* 	weight:6rem;
		height:7rem; */
		/* weight:4rem;
		height:6rem; */
	}

	.draws_one_cart_item_desc {
		/* position: relative;
		font-size: 0.8rem;
		left: 9rem;
		top: -10rem;
		width: 10rem;
		font-family: 'PingFang SC';
		font-weight: bold; */
		position: absolute;
		top: 0.5rem;
		/* 调整描述文本距离父元素顶部的距离 */
		left: calc(30% + 2.5rem);
		/* 图片宽度的 30%，再加上图片的右侧距离父元素的距离 1rem */
		font-size: 1rem;
		font-family: 'PingFang SC';
		/* font-weight: bold; */
	}

	.draws_one_cart_item_price {
		/* position: absolute;
		font-size: 1.1rem;
		left: 10rem; */
		/* 调整位置 */
		/* top: 7.2rem;
		width: 6rem;
		font-family: 'PingFang SC';
		color: #EC4228; */
		position: absolute;
		top: 5rem;
		/* 调整价格文本距离父元素顶部的距离 */
		left: calc(30% + 2.5rem);
		/* 图片宽度的 30%，再加上图片的右侧距离父元素的距离 1rem */
		font-size: 1rem;
		font-family: 'PingFang SC';
		color: #EC4228;
	}

	.order_cart_item_right {
		/* position: absolute;
		top: 8rem; */
		/* 与 order_one_cart_item_price 对齐 */
		/* left: 17rem; */
		/* 调整位置 */
		/* display: flex;
		align-items: center;
		font-size: 0.8rem;
		font-family: 'PingFang SC';
		width: auto; */
		/* 或者设置一个固定宽度 */
		/* margin-left: auto; */
		// position: absolute;
		// top: 5.5rem;
		// left: calc(30% + 5.5rem + 6rem);
		// display: flex;
		// align-items: center;
		// font-size: 0.8rem;
		// font-family: 'PingFang SC';
		// width: auto;
		// margin-left: auto;
		display: flex;
		align-items: center;
		font-size: 0.8rem;
		font-family: 'PingFang SC';
		// margin: 0;
		// padding: 0;
		margin-left: 40px;
	}

	.del_btn {
		position: absolute;
		top: 10px;
		/* 根据需要调整距离顶部的距离 */
		right: 10px;
		/* 根据需要调整距离右侧的距离 */
		//width: 30px;
		/* 根据需要调整按钮宽度 */
		//height: 30px;
		/* 根据需要调整按钮高度 */
		// z-index: 5;
	}

	.reduce,
	.plus {
		font-size: 1.5rem;
		color: #888888;
		cursor: pointer;
		margin: 0;
	}

	.input_text {
		width: 2rem;
		height: 1.5rem;
		text-align: center;
		border: 1px solid;
		/* #888888 */
		border-radius: 15px;
		margin: 0 0.5rem;
		font-size: 1rem;
		/* 调整输入框的左右间距 */
	}

	.bottom {
		position: fixed;
		bottom: 5rem;
		/* width: calc(100vw - 2rem); */
		width: 100vw;
		line-height: var(--footer-height);
		color: #000000;
		background-color: white;
		z-index: 2;
		height: 5rem;
		// display: flex;

	}

	.bottom_txt1 {
		position: relative;
		font-size: 1rem;
		font-family: 'PingFang SC';
		font-weight: bold;
		margin-left: 1rem;
		top: -0.5rem;
	}

	.bottom_txt2 {
		position: relative;
		font-size: 1.5rem;
		margin-left: 1rem;
		font-family: 'PingFang SC';
		/*font-weight: bolder*/
		;
		top: -1.5rem;
	}

	.bottom_btn {
		// position: fixed;
		// bottom: 7rem;
		height: 3rem;
		position: absolute;
		width: 9rem;
		background-color: #000000;
		right: 20px;
		top: 1rem;
		justify-content: center;
		border-radius: 15px;
		// margin-left: 15rem;
		// margin-right: ;
	}

	.bottom_txt3 {
		margin: 0;
		padding: 0;
		position: relative;
		font-size: 1.8rem;
		font-family: 'PingFang SC';
		font-weight: bold;
		// height: 2rem;
		color: white;
		text-align: center;
		// justify-content: center;
		// align-items: center;
	}

	.van-toast__text {
		font-size: 1.5rem;
	}

	.van-toast {
		width: 80vw;
		/* 自定义宽度 */
		height: 10vh;
	}
</style>